<!DOCTYPE html>
<html manifest="offlinemanifest.appcache" content-type="text/cache-manifest">
<head>
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"> 
<meta name="viewport" content="width=320,maximum-scale=1.3,user-scalable=no">
<title>美女与野兽</title>
    <link rel="stylesheet" href="css/bootstrap.min.css">
    <link rel="stylesheet" href="css/softkeys-0.0.1.css">
    <style>
        body{ background-color: #F0F0F0 }
        .jq22-header h3{ text-align: center; line-height: 30px; }
    </style>
<style>
.term {
    font-family: courier,fixed,swiss,monospace,sans-serif;
    font-size: 14px;
    color: #f0f0f0;
    background: #000000;
}

.termReverse {
    color: #000000;
    background: #00ff00;
}
#note {
    font-size: 12px;
}
#copyright {
    font-size: 10px;
}
#clipboard {
    font-size: 12px;
}
</style>
</head>
<body onload="tuntapWS_connect();startServer();start();">
<script type="text/javascript">
function checkclient(){
    var ua = (navigator.userAgent || navigator.vendor || window.opera)
    if (ua!=null) {
        var uaName = ua.toLowerCase();
        console.log(uaName);
        if (/android/i.test(uaName)){
            //return "android";
            return "mobile";
        }else if (/ip(hone|od)/i.test(uaName)) { 
            //return "iphone";
            return "mobile";
        }else{
            return "server";
        }
    }
    return "server";
}

var ws=null;
var ip_agent="android";
function startServer() {        
        ip_agent=checkclient();
      //  var url = document.getElementById("serverip").value;// "ws://192.168.0.102:8887";   
        var url ="ws://192.168.3.127:8080/websocketchat/hao/msg";  
        //var url ="ws://"+window.location.host+"/websocketchat/hao/msg"
        if ('WebSocket' in window) {        
            ws = new WebSocket(url);        
        } else if ('MozWebSocket' in window) {        
            ws = new MozWebSocket(url);        
        } else {        
            alert('浏览器不支持');        
            return;      
        }        
        ws.onopen = function() {        
            //alert('Opened!');        
            document.getElementById("test_serial3").style.backgroundColor = "yellow";
            document.getElementById("test_serial3").innerHTML = "monitor open";
        };        
        // 收到服务器发送的文本消息, event.data表示文本内容        
        ws.onmessage = function(event) {        
            console.log('Receive message: ' + event.data);       
            //log('Receive message: ' + event.data);       
        };        
        ws.onclose = function() {        
            //alert('Closed!');        
            document.getElementById("test_serial3").style.backgroundColor = "blue";
            document.getElementById("test_serial3").innerHTML = "monitor closed";
        };        
          
}
function validateIP(str){
    return !!str.match(/^((25[0-5]|2[0-4]\d|[01]?\d\d?)($|(?!\.$)\.)){4}$/);
}
var this_ip="";
function checkip(){
    var vm_ip=document.getElementById("text_clipboard").value.trim();
    //console.log("vm_ip:"+vm_ip);
    if(this_ip.trim()!=vm_ip.trim()){
        if(validateIP(vm_ip)){
            //var thisclient=checkclient();
            //console.log("send websocket"+ thisclient);
            console.log("send websocket ---"+ip_agent);
            ws.send("create#"+vm_ip+"#"+vm_ip+"#"+ip_agent);
            document.getElementById("ip_agent").value="haha:"+ip_agent;
        }
    }
    this_ip=vm_ip.trim();
}

var abc=setInterval("checkip()",1000);
</script>
<input type="hidden" id="ip_agent">

<table border="0">
<script type="text/javascript" src="utils.js"></script>
<script type="text/javascript" src="term.js"></script>
<script type="text/javascript" src="cpux86.js"></script>
<script type="text/javascript" src="jslinux.js"></script>
</table>
<div style="display:none">
	<input type="button" value="Clear clipboard" onclick="clear_clipboard();"><br>
	<textarea rows="4" cols="40" id="text_clipboard"></textarea><br>
</div>
	<h1 id="test_serial2">network status</h1>
	<h1 style="backgroundColor:red" id="test_serial3">monitor</h1>
	<h2 style="display:none" id="hdd_debug">hdd</h1>
	
	<!-- other commands -->
	<div class="othercommands">
	<!--a href="the_package.sh">package</a-->
	<button onclick="start();">boot</button>
	<button onclick="tuntapWS_connect();">reconnect</button>
	<button onclick="check_tuntapWS_connect();">check net</button>
	<button onclick="stop_tuntap();">stop net</button>
	</div>

	<!-- processing ttyS1 data -->
	<script>
	tuntap_bufferSize = 100;
	tuntap_bufferTimeout = 100;
	function tuntap_sendData(data)
	{
		tuntapWS_sendData(data);
	}
	</script>

	<!-- websockets net -->
	<script type="text/javascript" src="network-websockets.js"></script>
	<div class="roster" id="roster">
	</div>
	<script>
	if (window.applicationCache) {
        console.log("applicationCache-----");
	    applicationCache.addEventListener('updateready', function() {
		if (confirm('An update is available. Reload now?')) {
            console.log("reload----");
		    window.location.reload();
		}
	    });
	}
	</script>
<!-- end net -->
    <div class="softkeys" data-target="input[name='code']"></div>
    <div style="display:none" class="jq22-container"><!--for softkeys demo ，not used  -->
        <div class="container-fluid mt50">
                  <form class="row form">
                      <div  class="col-sm-offset-4 col-sm-4 form-group">
                          <input type="text" name="code" class="form-control input-lg">
                      </div>
                  </form>
          </div>

    </div>
   
   
  <script src="js/jquery-1.11.0.min.js"></script>
    <script src="js/softkeys-0.0.1.js"></script>
    <script type="text/javascript">
        $(document).ready(function(){
                $('.softkeys').softkeys({
                    target : $('.softkeys').data('target'),
                    layout : [
                        [
                            ['`','~'],
                            ['1','!'],
                            ['2','@'],
                            ['3','#'],
                            ['4','$'],
                            ['5','%'],
                            ['6','^'],
                            ['7','&amp;'],
                            ['8','*'],
                            ['9','('],
                            ['0',')'],
                            ['-', '_'],
                            ['=','+'],
                            'delete'
                        ],
                        [   'tab',
                            'q','w','e','r','t','y','u','i','o','p',
                            ['[','{'],
                            [']','}']
                        ],
                        [
                            'capslock',
                            'a','s','d','f','g','h','j','k','l',
                          [';',':'],
                            ["'",'&quot;'],
                            ['\\','|'],
                            'return'
                        ],
                        [
                            'shift',
                            'z','x','c','v','b','n','m',
                            [',','&lt;'],
                            ['.','&gt;'],
                            ['/','?'],
                            ['@']
                           
                        ],
                        [
                         'space'
                        ]
                    ]
                });
            });
    </script>



</body>
</html>
